<template>
	<view class="wating-center-content">
		<view class="custom-bar-head">
			<view class="custom-name">
				{{currentData}}
			</view>
			<!-- <view class="custom-Q">
				<text class="cuIcon-search"></text>
			</view> -->
		</view>
		<view class="swiper-nav">
			<view class="snav-box " :class="[current=='cg'?'snav-box-active':'']" data-name='cg' @click="queryData">
				<text class="snav-name">采购申请</text><text class="snav-num">({{cgCount}})</text>
			</view>
			<view class="snav-box" :class="[current=='dl'?'snav-box-active':'']" data-name='dl' @click="queryData">
				<text class="snav-name">采购执行</text><text class="snav-num">({{dlcgCount}})</text>
			</view>
			<view class="snav-box" :class="[current=='ht'?'snav-box-active':'']" data-name='ht' @click="queryData">
				<text class="snav-name"> 合同管理</text><text class="snav-num">({{htCount}})</text>
			</view>
			<!-- <view class="snav-box">
				<text class="snav-name">固定资产</text><text class="snav-num">(9)</text>
			</view> -->
		</view>
		<view class="show-data">
			<list-info :url='currentUrl' :data="pdata" :type="ptype" :currentType='currentType'></list-info>
		</view>
	</view>
</template>

<script>
	import listInfo from '../component/list-info.vue'
	import {
		queryTotal
	} from '../../api/service.js'
	export default {
		components: {
			listInfo
		},
		onShow: function() {
			console.log('App2 Show')
		},
		props: ['data'],
		watch: {
			data: function(newdt, olddt) {
				this.showInfo();
				this.setData();
			}
		},
		mounted() {
			var _this=this;
			uni.$on('updateMount',function(data){
				_this.showInfo();
			})
		},
		data() {
			return {
				cgCount: 0,
				dlcgCount: 0,
				htCount: 0,
				current: 'cg',
				currentType:0,
				url: '',
				type: '',
				cgUrl: '',
				dlUrl: '',
				htUrl: '',
				ptype:'cg',
				currentData: '数据',
				currentUrl: '/cg/appovelist',
				pdata:{
					keys1:'',
					keys2:'purCode',
					keys3:'purName',
					keys4:'processStatus_dictText',
					keys5:'createTime'
				}


			}
		},
		created() {
			this.showInfo();
			this.setData();
		},
		methods: {
			showInfo() {
				
				queryTotal({
					status: this.data.status,
					type: this.data.type
				}).then(res => {
					if (res.success) {
						this.cgCount = res.result.cgCount;
						this.dlcgCount = res.result.dlcgCount;
						this.htCount = res.result.htCount;
					}
				})
			},
			// 通用组件 传入参数，做到组件模块请求接口 url 动态传入，title 动态追加
			setData() {
				console.log(this.data)
				if (this.data.status == 0 && this.data.type == 'APPROVE') {
					this.cgUrl = '/cg/appovelist';
					this.currentUrl = '/cg/appovelist';
					this.dlUrl = '/agenciesTask/appovelist';
					this.htUrl = '/tHtContract/appovelist';
					this.currentData = '待审批数据'
                   this.currentType=0;
				}
				if (this.data.status == 0 && this.data.type == 'PROCESS') {
					this.cgUrl = '/cg/processlist';
					this.dlUrl = '/agenciesTask/processlist';
					this.htUrl = '/tHtContract/list';
					this.currentData = '待处理数据'
					this.currentUrl = '/cg/processlist';
					  this.currentType=0;
				}
				if (this.data.status == 1 && this.data.type == 'APPROVE') {
					this.cgUrl = '/cg/appovedlist';
					this.dlUrl = '/agenciesTask/appovedlist';
					this.htUrl = '/tHtContract/auditFinisedlist';
					this.currentData = '已审批数据'
					this.currentUrl = '/cg/appovedlist';
					  this.currentType=1;
				}
				if (this.data.status == 1 && this.data.type == 'PROCESS') {
					this.cgUrl = '/cg/processedlist';
					this.dlUrl = '/agenciesTask/processedlist';
					this.htUrl = '/tHtContract/appoveFinisedlist';
					this.currentData = '已处理数据';
					this.currentUrl = '/cg/processedlist';
					  this.currentType=1;
				}
			},
			// 向通用组件传入不同参数。子组件根据padta 参数显示对接模块信息字段
			queryData(e) {
				// console.log(e)
				var currentName = e.currentTarget.dataset.name;
				this.current = e.currentTarget.dataset.name;
				this.currentUrl = currentName == 'cg' ? this.cgUrl : (currentName == 'dl' ? this.dlUrl : this.htUrl);
				if(currentName=='dl'){
					this.pdata={
						keys1:'entityType',
						keys2:'purCode',
						keys3:'purName',
						keys4:'processStatus_dictText',
						keys5:'createTime'
					}
					
				}else if(currentName=='cg'){
					this.pdata={
						keys1:'',
						keys2:'purCode',
						keys3:'purName',
						keys4:'processStatus_dictText',
						keys5:'createTime'
					}
				}else{
					this.pdata={
						keys1:'',
						keys2:'ctrNo',
						keys3:'ctrName',
						keys4:'processStatus_dictText',
						keys5:'createTime'
					}
				}
				this.ptype=currentName;
				this.showInfo();
			}

		}
	}
</script>

<style lang="scss">
	.wating-center-content {
		position: relative;
		background: #fff;
		height: 100%;
        padding-top:160rpx;
		.custom-bar-head {
			width: 100%;
			height: 76rpx;
			padding: 0 32rpx;
			position: fixed;
			top: 0;
			left: 0;
			z-index: 10;
			opacity: 1;
			background: linear-gradient(135deg, rgba(50, 157, 247, 1) 0%, rgba(64, 122, 224, 1) 100%);
			line-height: 76rpx;
			text-align: center;
			font-size: 36rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);

			.custom-name {
				width: 100%;
				height: 76rpx;
				position: relative;
			}

			.custom-Q {
				position: absolute;
				width: 40rpx;
				height: 40rpx;
				top: 18rpx;
				right: 32rpx;
				z-index: 5;
				line-height: 40rpx;
			}
		}
	}

	.swiper-nav {
		display: flex;
		flex-direction: row;
		justify-content: center;
		padding: 22rpx 0rpx;
		position: fixed;
		width: 100%;
		top:76rpx;
		left: 0;
		z-index: 10;
		background-color: #fff;
		border-bottom: 2rpx solid #F7F4F4;

		.snav-box {
			flex: 1;
			text-align: center;
			position: relative;

			.snav-name {
				color: #666;
				font-size: 26rpx;
			}

			.snav-num {
				color: #666;
				font-size: 22rpx;
			}
		}

		.snav-box-active {
			.snav-name {
				font-size: 30rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: rgba(51, 51, 51, 1);
			}

			&:after {
				position: absolute;
				content: '';
				width: 58rpx;
				height: 4rpx;
				left: 50%;
				bottom: -22rpx;
				background: #3C85E7;
				transform: translate(-50%, 0);
			}
		}
	}

	.show-data {
		width: 100%;
		position: relative;
		height: auto;

	}
</style>
